/* rem 方案 */ 

@media screen and (max-width: 320px) {
    html {
        font-size: 10px !important;
    }
}

@each $size in (320, 360, 375, 384, 411, 414, 448, 480, 512, 544, 576, 608, 640, 650, 750, 768, 800, 850, 900, 950, 1024) {
    @media screen and ( min-width: #{$size}px ) {
        $max: 480;
        $font-size: if( $size < $max, $size, $max);
        html {
            font-size: #{$size / 375 *13 }px !important;
        }
        .page {
            font-size: #{$font-size/375 * 13}px;
        }
        :root {
            --rem: #{$size/375 * 13};
            --width-fill: #{$size}px;
        }
    }
}

@function torem($val) {
    @return #{($val/375 * 13)}rem;
}
.page-fill {
    width: var(--width-fill);
    margin: 0 auto;
}
.width-fill {
    width: 100%;
}